<template>
	<view class="Recharge_content Transfer_content">
		<view class="kuang">
			<view class="title">
				<view class="inline-block left">
					<image src="../../static/image/left.png" mode="" @tap="back"></image>
				</view>
				<view class="inline-block titleText" style="margin-left: 214upx;">
					{{i18n.zr}}
				</view>
			</view>			
			<view class="choice" style="margin-top: 57upx;">
				<view class="chose_coin">
					<image :src="titleimg"></image>
					<text>{{symbol}}</text>
				</view>
				<view class="picker">
					<view class="">
						{{symbol}}
					</view>
				</view>
			</view>
			<view class="out_detial in_block">
				<view>{{i18n.outdetial}}{{symbol}}</view>
				<view class="imgbox">
					<canvas class="canvas" canvas-id="qrcode" style="width: 200px;height: 200px;" />
				</view>
				<view class="btns">
					<view class="save_btn" @tap="saveQrcode" v-if="isSave">
						{{i18n.savebtn}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import tkiQrcode from "../../components/tki-qrcode/tki-qrcode.vue"
	import account from '../../common/account.js'
	import {myMixins} from '../../common/mixins.js'
	import Clipboard from 'clipboard';  
	import uQRCode from '../../common/uqrcode.js'
	export default {
		computed: {
			i18n() {
				return this.$t('user')
			}
		},
		mixins: [myMixins], // 使用mixin
		data() {
			return {
				array: ['OEX', 'ETH', 'BTC', 'USDT'],
				index: 0,
				assetId:"",
				symbol:"",
				amount:"",
				accountID:"",
				accountName:"",
				//二维码部分
				val:"",
				size:150,//二维码尺寸
				background:"#ffffff",//二维码背景色
				icon:"../../static/image/cion_icon.png",
				iconSize:30,
				onval:true,
				showLoading:true,
				loadingText:"二维码生成中",
				box_rgba:false,
				src: '',
				isSave:false,
				qrcodeSrc:"",
				decimals:"",
				assetName:"",
				titleimg:""
			}
		},
		components: {tkiQrcode},
		onLoad(options) {
			console.log(options)
					var _this=this
			//获取个人账户信息
			//this.getAccountExByName();
			//console.log(options)
			// this.assetId = options.assetId;
			this.symbol = options.symbol;
			this.amount = options.amount;
			this.assetId= Number(options.assetId);
			this.decimals=options.decimals;
			this.assetName=options.assetName
			// console.log(this.assetId)
			this.init(options.symbol);
			//转入二维码
			setTimeout(()=>{
				this.makeQrcodeImg()
			},1000)
			if(this.assetId==0){
				_this.titleimg="../../static/image/icon_detail.png"
			}else{
				_this.titleimg="../../static/image/greylogo.png"
			}
		},
		methods: {
			async getAccountExByName(){
				const _this = this;
				const accountName =  account.getAccount().then(res =>{
					//console.log(res)
					_this.accountName = res.data.result.accountName;
					_this.accountID = res.data.result.accountID;
				}).catch(error =>{
					console.log(error)
				})
			},
			init(symbol){
				//初始化转入币种
				const _this = this;
				this.array.map((item,index) =>{
					if(item == symbol){
						_this.index = index;
					}
				})
			},
			bindPickerChange: function(e) {
					//console.log('picker发送选择改变，携带值为', e.target.value)
					this.index =  e.target.value;
					this.symbol = this.array[e.target.value];
			},
			back(){
				this.$CommonJS.navigateBack()
			},
			copy(){
				//复制
				const _this = this;
				//#ifdef APP-PLUS
				uni.setClipboardData({
				    data: this.account_info.accountName,
				    success: function () {
				        uni.showToast({
				        	title:_this._i18n.locale == 'zh_CN' ? '已复制':'Copied',
				        })
				    }
				});
				//#endif
				//#ifdef H5
			
					var clipboard = new Clipboard(".tag-read");
					
				
		      clipboard.on("success", e => {
		       this.$CommonJS.showToast("复制成功")
		        // 释放内存
		        clipboard.destroy();
		      });
		      clipboard.on("error", e => {
		        // 不支持复制
		       this.$CommonJS.showToas("该浏览器不支持自动复制");
		        // 释放内存
		        clipboard.destroy();
		
		      });
					//#endif
			},
			async makeQrcodeImg(){
				//制作二维码
				let _this = this;
				//二维码传递数据
				console.log(this.assetId)
				const str = JSON.stringify({
					accountID:this.account_info.accountID,
					ToaccountName:this.account_info.accountName,
					assetId:_this.assetId,
					Tocoin_name:this.assetName
				})
				
				uQRCode.make({
					canvasId: 'qrcode',
					componentInstance: this,
					text: str,
					size: 200,
					margin: 10,
					backgroundColor: '#ffffff',
					foregroundColor: '#000000',
					fileType: 'jpg',
					correctLevel: uQRCode.errorCorrectLevel.H,
					success: res => {
						this.isSave = true;
						this.qrcodeSrc = res;
					}
				})
				this.val = JSON.stringify(str)
				this.box_rgba = true
				this.isSave = true
				
				
			},
			saveQrcode() {
				//保存二维码
				let _this = this;
				uni.saveImageToPhotosAlbum({
						filePath: this.qrcodeSrc,
						success: function () {
							uni.showToast({
								title:_this._i18n.locale == 'zh_CN' ? '已保存':'Saved',
							})
						}
				});
			},
			qrR(res) {
				this.src = res
			},
		}
	}
</script>

<style lang="stylus">
	@import "../../static/stylus/wallet/wallet.stylus"
	
</style>
